{include file="/index/top"}
<style>
    /* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
    .cycle-outer {
        width: 534px;
        height: 260px;
        position: relative;
        /*top: 50%;*/
        /*margin-top: -160px;*/
        left: 50%;
        margin-left: -267px;
    }

    .cycle-wrapper {
        width: 534px;
        height: 260px;
        margin: 0 auto;
        position: relative;
    }

    .cycle-wheel-front {
        margin: 100px 0 0 330px;
    }

    .cycle-wheel-back {
        margin: 100px 0 0 0px;
    }

    .cycle-wheel-outer {
        background: transparent;
        border: 5px solid #aaa;
        border-radius: 50%;
        width: 190px;
        height: 190px;
        position: absolute;
        margin-top: 5px;
        -webkit-animation: wheel-rotate 2s linear infinite;
        -moz-animation: wheel-rotate 2s linear infinite;
        animation: wheel-rotate 2s linear infinite;
    }

    .cycle-wheel-outer:after {
        background: transparent;
        border: 4px solid #EF9058;
        border-radius: 50%;
        width: 176px;
        height: 176px;
        position: absolute;
        margin: 3px;
        content: "";
    }

    @-webkit-keyframes wheel-rotate {
        from {
            -webkit-transform: rotate(0deg);
        }
        to {
            -webkit-transform: rotate(360deg);
        }
    }

    @keyframes wheel-rotate {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }

    @-moz-keyframes wheel-rotate {
        from {
            -moz-transform: rotate(0deg);
        }
        to {
            -moz-transform: rotate(360deg);
        }
    }

    .spoke {
        position: absolute;
        width: 1px;
        height: 200px;
        background: #ccc;
        margin-left: 95px;
        margin-top: -5px;
        z-index: 0;
    }

    .spoke:after {
        content: "";
        position: absolute;
        width: 1px;
        height: 200px;
        background: #ccc;
        -webkit-transform: rotate(120deg);
        -moz-transform: rotate(120deg);
        transform: rotate(120deg);
    }

    .spoke:before {
        content: "";
        position: absolute;
        width: 1px;
        height: 200px;
        background: #ccc;
        -webkit-transform: rotate(240deg);
        -moz-transform: rotate(240deg);
        transform: rotate(240deg);
    }

    .spoke-container li:nth-child(2) {
        -webkit-transform: rotate(30deg);
        -moz-transform: rotate(30deg);
        transform: rotate(30deg);
    }

    .inner-disc {
        background: #666;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        position: absolute;
        left: 50%;
        margin-left: -10px;
        top: 50%;
        margin-top: -10px;
    }

    .cycle-wheel-back .inner-disc:after {
        content: "";
        background: #666;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        position: absolute;
        left: 50%;
        margin-left: -10px;
        top: 50%;
        margin-top: -10px;
    }

    .inner-disc-2 {
        background: transparent;
        width: 6px;
        height: 6px;
        border: 2px solid #FFF;
        border-radius: 50%;
        position: absolute;
        left: 50%;
        margin-left: -5px;
        top: 50%;
        margin-top: -5px;
    }

    .cycle-wheel-back .inner-disc-2:after {
        content: "";
        background: transparent;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        position: absolute;
        left: 50%;
        margin-left: -13px;
        top: 50%;
        margin-top: -13px;
        border: 4px dotted #666;
    }

    /* Main Body */

    .cycle-body {
        margin-left: 125px;
    }

    .front-wheel-frame {
        background: #5E999B;
        width: 8px;
        height: 180px;
        position: absolute;
        z-index: 2;
        transform: rotate(-25deg);
        -webkit-transform: rotate(-25deg);
        -moz-transform: rotate(-25deg);
        margin: -72px 0 0 260px;
    }

    .top-frame {
        background: #5E999B;
        width: 180px;
        height: 8px;
        position: absolute;
        z-index: 2;
        margin: -20px 0 0 62px;
        transform: rotate(-8deg);
        -webkit-transform: rotate(-8deg);
        -moz-transform: rotate(-8deg);
    }

    .front-frame {
        background: #5E999B;
        width: 8px;
        height: 160px;
        position: absolute;
        z-index: 2;
        transform: rotate(41deg);
        -webkit-transform: rotate(41deg);
        -moz-transform: rotate(41deg);
        margin: -36px 0 0 189px;
    }

    .center-frame {
        background: #5E999B;
        width: 8px;
        height: 205px;
        position: absolute;
        z-index: 2;
        transform: rotate(-33deg);
        -webkit-transform: rotate(-33deg);
        -moz-transform: rotate(-33deg);
        margin: -84px 0 0 75px;
    }

    .back-frame {
        background: #5E999B;
        width: 8px;
        height: 136px;
        position: absolute;
        z-index: 2;
        transform: rotate(39deg);
        -webkit-transform: rotate(39deg);
        -moz-transform: rotate(39deg);
        margin: -23px 0 0 19px;
    }

    .bottom-frame {
        background: #5E999B;
        width: 159px;
        height: 8px;
        position: absolute;
        z-index: 2;
        margin: 100px 0 0 -16px;
    }

    .handlebar-front {
        width: 60px;
        height: 8px;
        background: #5E999B;
        z-index: 2;
        position: absolute;
        margin: -68 0 0 222px;
        -webkit-border-top-left-radius: 3px;
        -webkit-border-bottom-left-radius: 3px;
        -moz-border-radius-topleft: 3px;
        -moz-border-radius-bottomleft: 3px;
        border-top-left-radius: 3px;
        border-bottom-left-radius: 3px;
    }

    .handlebar-curve {
        width: 40px;
        height: 40px;
        border: 8px solid #666;
        -webkit-border-top-right-radius: 100%;
        -webkit-border-bottom-right-radius: 100%;
        -webkit-border-bottom-left-radius: 100%;
        -moz-border-radius-topright: 100%;
        -moz-border-radius-bottomright: 100%;
        -moz-border-radius-bottomleft: 100%;
        border-top-right-radius: 100%;
        border-bottom-right-radius: 100%;
        border-bottom-left-radius: 100%;
        background: transparent;
        position: absolute;
        margin: -68px 0 0 258px;
        border-left: 8px solid transparent;
        border-top: 8px solid #666;
        border-bottom: 8px solid #666;
    }

    .seat {
        width: 50px;
        height: 10px;
        background: #666;
        border-radius: 44%;
        position: absolute;
        margin: -73px 0 0 15px;
    }

    .seat:after {
        width: 0px;
        height: 0px;
        border-style: solid;
        border-width: 0 40px 16px 40px;
        border-color: transparent transparent #666 transparent;
        content: "";
        position: absolute;
        z-index: 3;
        -webkit-transform: rotate(-12deg);
        -moz-transform: rotate(-12deg);
        transform: rotate(-12deg);
        position: absolute;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%;
        margin: 0 0 0 -26px;
    }

    .seat:before {
        width: 0px;
        height: 0px;
        border-style: solid;
        border-width: 0 40px 16px 40px;
        border-color: transparent transparent #666 transparent;
        content: "";
        position: absolute;
        z-index: 3;
        -webkit-transform: rotate(179deg);
        -moz-transform: rotate(179deg);
        transform: rotate(179deg);
        position: absolute;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%;
        margin: 0 0 0 -26px;
    }

    .seat span {
        width: 32px;
        height: 19px;
        background: #666;
        border-radius: 100%;
        position: absolute;
        margin: 1px 0 0 -22px;
        -webkit-transform: rotate(-11deg);
        -moz-transform: rotate(-11deg);
        transform: rotate(-11deg);
    }

    /* Chain and Pedals */

    .chain-wrapper {

    }

    .chain-rotation {
        position: absolute;
        z-index: 16;
    }

    .chain-disc-inner {
        background: #666;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        position: absolute;
        margin: 2px;
        z-index: 4;
    }

    .chain-disc-outer {
        background: #FFF;
        width: 22px;
        height: 22px;
        border: 5px solid #666;
        border-radius: 50%;
        position: absolute;
        margin: 87px 0 0 250px;
        z-index: 3;
        content: "";
    }

    .chain-rods {
        height: 70px;
        width: 6px;
        background: #666;
        position: absolute;
        margin: 67px 0 0 263px;
        z-index: 15;
        -webkit-animation: wheel-rotate 2s linear infinite;
        -moz-animation: wheel-rotate 2s linear infinite;
        animation: wheel-rotate 2s linear infinite;
    }

    .chain-rods:before {
        content: "";
        height: 70px;
        width: 6px;
        background: #666;
        position: absolute;
        transform: rotate(120deg);
        -webkit-transform: rotate(120deg);
        -moz-transform: rotate(120deg);
    }

    .chain-rods:after {
        content: "";
        height: 70px;
        width: 6px;
        background: #666;
        position: absolute;
        transform: rotate(240deg);
        -webkit-transform: rotate(240deg);
        -moz-transform: rotate(240deg);
    }

    .outer-axle {
        height: 70px;
        width: 70px;
        border-radius: 50%;
        background: transparent;
        border: 5px solid #666;
        position: absolute;
        margin: 62px 0 0 226px;
        z-index: 3;
    }

    .outer-axle:after {
        content: "";
        height: 74px;
        width: 74px;
        border-radius: 50%;
        background: transparent;
        border: 5px dotted #666;
        margin: -7px;
        position: absolute;
        z-index: 3;
        -webkit-animation: wheel-rotate 2s linear infinite;
        -moz-animation: wheel-rotate 2s linear infinite;
        animation: wheel-rotate 2s linear infinite;
    }

    .chain-up {
        background-color: transparent;
        background-size: 8px 2px;
        background-position: 0 0, 30px 30px;
        width: 155px;
        height: 4px;
        position: absolute;
        z-index: 9;
        background: #EEE;
        -webkit-transform: rotate(-11deg);
        -moz-transform: rotate(-11deg);
        transform: rotate(-11deg);
        margin: 76px 0 0 98px;
    }

    .chain-up:before {
        content: "";
        background-color: transparent;
        background-image: linear-gradient(90deg, #666 25%, transparent 25%, transparent 75%, #666 75%, #666);
        background-size: 8px 2px;
        background-position: 0 0, 30px 30px;
        width: 155px;
        height: 4px;
        animation: chainUp 2s linear infinite;
        -moz-animation: chainUp 2s linear infinite;
        -webkit-animation: chainUp 2s linear infinite;
        position: absolute;
        z-index: 10;
    }

    .chain-bottom {
        background-color: transparent;
        background-size: 8px 2px;
        background-position: 0 0, 30px 30px;
        width: 155px;
        height: 4px;
        position: absolute;
        z-index: 9;
        background: #EEE;
        -webkit-transform: rotate(9deg);
        -moz-transform: rotate(9deg);
        transform: rotate(9deg);
        margin: 127px 0 0 98px;
    }

    .chain-bottom:before {
        content: "";
        background-color: transparent;
        background-image: linear-gradient(90deg, #666 25%, transparent 25%, transparent 75%, #666 75%, #666);
        background-size: 8px 2px;
        background-position: 0 0, 30px 30px;
        width: 155px;
        height: 4px;
        animation: chainDown 2s linear infinite;
        -moz-animation: chainDown 2s linear infinite;
        -webkit-animation: chainDown 2s linear infinite;
        position: absolute;
        z-index: 10;
    }

    @keyframes chainUp {
        0% {
            background-position: 0 25%;
        }
        100% {
            background-position: 100% 0;
        }
    }

    @-moz-keyframes chainUp {
        0% {
            background-position: 0 25%;
        }
        100% {
            background-position: 100% 0;
        }
    }

    @-webkit-keyframes chainUp {
        0% {
            background-position: 0 25%;
        }
        100% {
            background-position: 100% 0;
        }
    }

    @keyframes chainDown {
        0% {
            background-position: 100% 0;
        }
        100% {
            background-position: 0 25%;
        }
    }

    @-moz-keyframes chainDown {
        0% {
            background-position: 100% 0;
        }
        100% {
            background-position: 0 25%;
        }
    }

    @-webkit-keyframes chainDown {
        0% {
            background-position: 100% 0;
        }
        100% {
            background-position: 0 25%;
        }
    }

    .pedal-rod {
        height: 120px;
        width: 6px;
        background: #666;
        position: absolute;
        margin: -25px 0 0 0px;
    }

    .pedal-rod:before {
        width: 40px;
        height: 10px;
        background: #666;
        position: absolute;
        margin: 10px;
        content: "";
        margin: -7px -17px;
        -webkit-animation: pedal1 2s linear infinite;
        -moz-animation: pedal1 2s linear infinite;
        animation: pedal1 2s linear infinite;
    }

    .pedal-rod:after {
        width: 40px;
        height: 10px;
        background: #666;
        position: absolute;
        margin: 10px;
        content: "";
        margin: 119px -17px;
        -webkit-animation: pedal2 2s linear infinite;
        -moz-animation: pedal2 2s linear infinite;
        animation: pedal2 2s linear infinite;
    }

    @keyframes pedal1 {
        0% {
            transform: rotate(00deg);
        }
        25% {
            transform: rotate(-140deg);
        }
        50% {
            transform: rotate(-180deg);
        }
        75% {
            transform: rotate(-240deg);
        }
        100% {
            transform: rotate(-360deg);
        }
    }

    @-moz-keyframes pedal1 {
        0% {
            -moz-transform: rotate(00deg);
        }
        25% {
            -moz-transform: rotate(-140deg);
        }
        50% {
            -moz-transform: rotate(-180deg);
        }
        75% {
            -moz-transform: rotate(-240deg);
        }
        100% {
            -moz-transform: rotate(-360deg);
        }
    }

    @-webkit-keyframes pedal1 {
        0% {
            -webkit-transform: rotate(00deg);
        }
        25% {
            -webkit-transform: rotate(-140deg);
        }
        50% {
            -webkit-transform: rotate(-180deg);
        }
        75% {
            -webkit-transform: rotate(-240deg);
        }
        100% {
            -webkit-transform: rotate(-360deg);
        }
    }

    @keyframes pedal2 {
        0% {
            transform: rotate(00deg);
        }
        25% {
            transform: rotate(-60deg);
        }
        50% {
            transform: rotate(-180deg);
        }
        75% {
            transform: rotate(-340deg);
        }
        100% {
            transform: rotate(-360deg);
        }
    }

    @-moz-keyframes pedal2 {
        0% {
            -moz-transform: rotate(00deg);
        }
        25% {
            -moz-transform: rotate(-60deg);
        }
        50% {
            -moz-transform: rotate(-180deg);
        }
        75% {
            -moz-transform: rotate(-340deg);
        }
        100% {
            -moz-transform: rotate(-360deg);
        }
    }

    @-webkit-keyframes pedal2 {
        0% {
            -webkit-transform: rotate(00deg);
        }
        25% {
            -webkit-transform: rotate(-60deg);
        }
        50% {
            -webkit-transform: rotate(-180deg);
        }
        75% {
            -webkit-transform: rotate(-340deg);
        }
        100% {
            -webkit-transform: rotate(-360deg);
        }
    }

    .bottle-holder {
        width: 20px;
        height: 36px;
        background: #daeded;
        border: 3px solid #5E999B;
        position: absolute;
        margin: 54px 0 0 -25px;
    }

    .bottle-holder:after {
        width: 20px;
        height: 3px;
        content: "";
        background: #5E999B;
        position: absolute;
        margin: 24px 0 0 0px;
    }

    .bottle-holder:before {
        background-color: #daeded;
        width: 18px;
        height: 10px;
        border-radius: 30% / 100%;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        content: "";
        position: absolute;
        margin-top: -13px;
        border: 1px solid #98baba;
        border-bottom: 0;
    }

    .bottle-holder span {
        position: absolute;
        width: 9px;
        height: 4px;
        background: #666;
        margin: -17px 0 0 5px;
    }

    .banner {
        position: absolute;
        z-index: 20;
        width: 100%;
        text-align: center;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 30%;
        margin: auto;
        padding-top: 320px;
    }

    .banner-text {
        font-family: Pecita;
        color: #ffffff;
        font-size: 70px;
    }

    .banner-text > p {
        line-height: 150px;
    }

    .left {
        float: left;
    }

    .right {
        float: right;
    }

    .content-news {
        width: 1200px;
        left: 0;
        right: 0;
        margin: 0 auto;
        padding-top: 100px;
    }

    .content-news-bd-r {
        margin-left: 30px;
        width: 1200px;
        position: relative;
    }

    .content-news-bd-r > ul > li > a:hover .content-news-bd-r-news > h4 {
        color: #009688;
    }

    .content-news-bd-r-news {
        float: left;
        width: 850px;
        overflow: hidden;
        white-space: normal;
        text-overflow: ellipsis;
        height: 220px;
    }

    .content-news-bd-r ul li {
        border: 1px solid #e4e4e4;
        height: 220px;
        border-radius: 15px;
        margin-top: 30px;

    }

    .content-news-bd-r > ul > li:first-child {
        margin-top: 0;
    }

    .content-news-bd-r-news > h4 {
        font-size: 20px;
        margin-top: 20px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

    .content-news-bd-r-news > p {
        margin-top: 12px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        font-weight: 100;
        line-height: 30px;
        font-size: 16px;
        height: 90px;
    }

    .news-details {
        cursor: pointer;
    }
</style>
<!--<script>-->
<!--ws = new WebSocket("ws://127.0.0.1:2346");-->
<!--ws.onopen = function () {-->
<!--alert("连接成功");-->
<!--ws.send('tom');-->
<!--alert("给服务端发送一个字符串：tom");-->
<!--};-->
<!--ws.onmessage = function (e) {-->
<!--alert("收到服务端的消息：" + e.data);-->
<!--};-->
<!--</script>-->
<div>
    <img src="__static__/images/apply.jpg" class="img-responsive" alt="Responsive image" width="100%">

    <div style="">
        <div style="position: absolute;display: block;top: 0;width: 100%">
            {include file="/index/topnav"}
            <div class="banner" id="child">
                <div class="banner-text layui-anim layui-anim-scaleSpring">
                    <p>网 院 计 算 机 协 会</p>

                    <p>协 会 新 闻</p>

                    <h3>交流学术知识，传播创新理念，激发创新意识，弘扬创新精神</h3>

                </div>
            </div>
        </div>
    </div>
    <!--<div>-->
    <!--<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">-->
    <!--<legend>总页数大于页码总数</legend>-->
    <!--</fieldset>-->
    <!--</div>-->

    <div class="content-news" style="margin-bottom: 30px">
        <div class="content-news-body" id="news">
            <div id="nonews">
                <div class="cycle-outer">
                    <div class="cycle-wrapper">
                        <div class="cycle-body">
                            <div class="seat">
                                <span></span>
                            </div>
                            <div class="front-wheel-frame"></div>
                            <div class="top-frame"></div>
                            <div class="front-frame">
                                <div class="bottle-holder">
                                    <span></span>
                                </div>
                            </div>
                            <div class="center-frame"></div>
                            <div class="back-frame"></div>
                            <div class="bottom-frame"></div>
                            <div class="handlebar-front"></div>
                            <div class="handlebar-curve"></div>
                        </div>
                        <div class="cycle-wheel cycle-wheel-back">
                            <div class="cycle-wheel-outer">
                                <div class="cycle-wheel-inner">
                                    <div class="cycle-wheel-inner-padding">
                                        <ul class="spoke-container">
                                            <li class="spoke"></li>
                                            <li class="spoke"></li>
                                        </ul>
                                        <div class="inner-disc"></div>
                                        <div class="inner-disc-2"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="cycle-wheel cycle-wheel-front">
                            <div class="cycle-wheel-outer">
                                <div class="cycle-wheel-inner">
                                    <div class="cycle-wheel-inner-padding">
                                        <ul class="spoke-container">
                                            <li class="spoke"></li>
                                            <li class="spoke"></li>
                                        </ul>
                                        <div class="inner-disc"></div>
                                        <div class="inner-disc-2"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="chain-up"></div>
                        <div class="chain-bottom"></div>
                        <div class="chain-rotation">
                            <div class="outer-axle"></div>
                            <div class="chain-disc-outer">
                                <div class="chain-disc-inner"></div>
                            </div>

                        </div>
                        <div class="chain-rods">
                            <div class="pedal-rod"></div>
                        </div>
                    </div>
                </div>

                <div style="text-align:center;clear:both;">
                    <h3 style="font-family:Pecita ">呜呜~我们还没有发布协会新闻，请耐心等待哦！~~~</h3>
                </div>
            </div>
            <div class="content-news-bd-r">
                <ul>
                    <li v-for="(news,index) in newsdata" v-if="index<10" class="news-details">
                        <a @click="gonewsdetails(news.id)">
                            <img :src="baseUrl+news.thumimg" width="300" height="220" class="left"
                                 style="border-radius: 15px 0  0 15px;">

                            <div class="content-news-bd-r-news right">
                                <h4>{{news.title}}</h4>

                                <p style="margin-bottom: 10px">{{news.intro}}</p>
                                <i class="layui-icon layui-icon-note"
                                   style="font-size: 22px; color: #009688;margin-top: 20px"><span
                                        style="margin-left: 10px;font-size: 16px;margin-top: 30px;color: #009688;">{{news.keywords}}</span></i>

                                <div style="position: relative;color: #009688;line-height: 40px;">
                                    <i class="layui-icon layui-icon-date"
                                       style="font-size: 22px; color: #009688;"></i><span
                                        style="margin-left: 10px;font-size: 16px;padding-bottom: 10px">{{news.datatime}}</span>
                                    <i class="layui-icon layui-icon-fire"
                                       style="font-size: 22px; color: #009688; margin-left: 70px"></i><span
                                        style="margin-left: 10px;font-size: 16px">{{news.hits}}</span>
                                    <i class="layui-icon layui-icon-praise"
                                       style="font-size: 22px; color: #009688; margin-left: 70px"></i><span
                                        style="margin-left: 10px;font-size: 16px">{{news.likes}}</span>
                                </div>
                            </div>

                        </a>
                    </li>
                </ul>
                <p aria-label="..." id="more" @click="nextlistpage()" style="height: 30px;line-height:30px;font-size: 16px; margin-top: 50px;text-align: center;color:#009688 ;cursor: pointer">
                    加载更多......
                </p>
            </div>
        </div>
    </div>
</div>
<script>
    var host = location.origin;
    function querystringStringify(obj) {
        var returnStr = '';
        for (var key in obj) {
            returnStr += (key + '=' + obj[key] + '&');
        }
        //第一个字符加上? 去掉最后一个&
        return returnStr ? ('?' + returnStr.substr(0, returnStr.length - 1)) : '';
    }
    var app = new Vue({
        el: '#news',
        data: {
            baseUrl: "__static__",
            newsdata: [],
            page: 1
        },
        methods: {
            gonewsdetails: function (newsid) {
                console.log(newsid);
                location = host + '/newsdetails' + querystringStringify({newsid: newsid});
            },
            nextlistpage: function () {
                var then = this;
                then.page++;
                $.ajax({
                    type: "post",
                    url: "api/getnewslists",
                    datatype: "json",
                    async: false,
                    contentType: "application/json",
                    data: JSON.stringify({page: then.page}),
                    headers: __AUTH__,
                    success: function (resp) {
                        resp.data.forEach(function (item, index) {
                            then.newsdata.push(resp.data[index]);
                            console.log(resp.data.length);
                            if(((resp.counts)%10) ==0 || ((resp.counts)%10<=10 || resp.counts == resp.data.length)){
                                $('#more').hide();
                            }
                        });
                    }
                });
            }
        },
        mounted: function () {
            var then = this;
            $.ajax({
                type: "post",
                url: "api/getnewslists",
                datatype: "json",
                async: false,
                data: JSON.stringify({page: then.page}),
                contentType: "application/json",
                headers: __AUTH__,
                success: function (resp) {
                    resp.data.forEach(function (item, index) {
                        then.newsdata.push(resp.data[index]);
                        if((resp.counts == resp.data.length)){
                            $('#more').hide();
                        }
                    });
                    if (then.newsdata.length == 0) {
                        $('#nonews').show();
                    } else {
                        $('#nonews').hide();
                    }
                }
            });
            if (then.page == 1) {
                $('.previous').addClass('disabled')
            }
        }
    })
</script>
<div style="padding-top: 30px">
    {include file="/index/footer"}
</div>
